<template>
  <nav>
    <a href="#" @click="changeComponent('Home')">Home</a>
    <a href="#" @click="changeComponent('Order')">Order</a>
    <p>Counter: {{ counter }}</p>
  </nav>
</template>

<script setup>
defineProps(['changeComponent', 'counter']);
</script>

<style scoped>
nav {
  display: flex;
  justify-content: space-around;
  align-items: center;
}
</style>
